import React, { useState } from 'react';
import styles from './index.less';
import { EyeOutlined, EyeInvisibleOutlined } from '@/utils/antdIcons';
import TextField from '../TextField';

export default ({ value, onChange, label = '密码', noremember = false }) => {
  const [visible, setVisible] = useState(false); // 密码可见
  return (
    <TextField
      value={value}
      onChange={onChange}
      label={label}
      type={visible ? 'text' : 'password'}
      suffix={
        <div className={styles.suffix_icon} onClick={() => setVisible(!visible)}>
          {visible ? <EyeOutlined /> : <EyeInvisibleOutlined />}
        </div>
      }
      noremember={noremember}
    />
  );
};
